<script type="text/template" id="readTemplate">
        <tr  id="${item_code}">
                <td>1</td>
                <td>${item_code}</td>
                <td>${item_name}</td>
                <td>${item_group_name}</td>
                <td style="text-align: right;">${default_price}</td>
				<td>${isis_name}</td>
				<td>${dbr_name}</td>
                <td width="110px"><a class="updateBtn" href="${updateLink}">Update</a> </td>
        </tr>
</script>

<!-- update form in dialog box -->
<div id="updateDialog" title="Update">
    <div>
        <form action="" method="post">
            <p>
               <label for="item_group_id">Grup Barang</label>
               <div class="input">
		<select name="item_group_id" id="item_group_id">
			<?php
				$dt = $this->mitem->getValueFromTable();
                                foreach($dt as $row){
				echo'<option value="'. $row->item_group_id .'" '. ($data['item_group_id'] == $row->item_group_id ?"SELECTED":"") .'>'. $row->item_group_name .'</option>';
				}
			?>
		</select>
	      </div>
          </p>
		  
		<p>
               <label for="item_category_id" width=200>Grup ISIS</label>
               <div class="input">
        <select name="item_category_id" id="item_category_id">
            <option value="0" SELECTED>Pilih Category</option>
            <?
                $dt = $this->mitem->getValueFromTableIsis();
                foreach($dt as $row){
                echo'<option value="'. $row->item_category_id .'" '. ($data['item_category_id'] == $row->item_category_id ?"SELECTED":"") .'>'. $row->category_name .'</option>';
                }
            ?>
        </select>
          </div>
         </p>

         <p>
               <label for="dbr_id" width=200>Grup DBR</label>
               <div class="input">
        <select name="dbr_id" id="dbr_id">
            <option value="0" SELECTED>Pilih Category</option>
            <?
                $dt = $this->mitem->getValueFromTableCategory();
                foreach($dt as $row){
                echo'<option value="'. $row->dbr_id .'" '. ($data['dbr_id'] == $row->dbr_id ?"SELECTED":"") .'>'. $row->dbr_name .'</option>';
                }
            ?>
        </select>
          </div>
         </p>


          <p>
          <label for="default_price">HET</label>
           <div class="input">
            <input type="text" id="default_price" name="default_price" />
          </div>
            </p>
	      
            <!--<p>
               <label for="username">Username:</label>
               <input type="text" id="username" name="username" />
            </p>
            <p>
               <label for="email">Email:</label>
               <input type="text" id="email" name="email" />
            </p>
            -->
            <input type="hidden" id="userId" name="id" />
        </form>
    </div>
</div>

<!-- message dialog box -->
<div id="msgDialog"><p></p></div>

<script type="text/javascript">
var readUrl   = '<?php echo base_url() ?>index.php/act_item/read',
    updateUrl = '<?php echo base_url() ?>index.php/act_item/update',
    delUrl    = '<?php echo base_url() ?>index.php/act_item/delete',
    delHref,
    updateHref,
    updateId;


$( function() {
    
    $( '#tabs' ).tabs({
        fx: { height: 'toggle', opacity: 'toggle' }
    });
    
    readUsers();
    
    $( '#msgDialog' ).dialog({
        autoOpen: false,
        
        buttons: {
            'Ok': function() {
                $( this ).dialog( 'close' );
                window.location.reload();
            }
        }
    });
    
        $( '#updateDialog' ).dialog({
        autoOpen: false,
        buttons: {
            'Update': function() {
                $( '#ajaxLoadAni' ).fadeIn( 'slow' );
                $( this ).dialog( 'close' );
                
                $.ajax({
                    url: updateHref,
                    type: 'POST',
		    dataType: 'json',
                    data: $( '#updateDialog form' ).serialize(),
                    
                    success: function( response ) {
                        //var obj = JSON.parse(response.message);
			//alert(response.message);
                        $( '#msgDialog > p' ).html( response.message );
			//$( '#msgDialog > p' ).html( response );
                        $( '#msgDialog' ).dialog( 'option', 'title', 'Success' ).dialog( 'open' );
                        
                        $( '#ajaxLoadAni' ).fadeOut( 'slow' );
                        
                        //--- update row in table with new values ---
                        
			var item_group_id = $( 'tr#' + updateId + ' td' )[ 2 ];
                        //var username = $( 'tr#' + updateId + ' td' )[ 2 ];
                        //var email = $( 'tr#' + updateId + ' td' )[ 3 ];
                       
                        $( item_group_id ).html( response.groupname);
                        //$( username ).html( $( '#username' ).val() );
                        //$( email ).html( $( '#email' ).val() );
                        
                        //--- clear form ---
                        $( '#updateDialog form input' ).val( '' );
                        
                    } //end success
                    
                }); //end ajax()
            },
            
            'Cancel': function() {
                $( this ).dialog( 'close' );
            }
        },
        width: '350px'
    }); //end update dialog
    
    
    $( '#records' ).delegate( 'a.updateBtn', 'click', function() {
        updateHref = $( this ).attr( 'href' );
        updateId = $( this ).parents( 'tr' ).attr( "id" );
        

        
        $( '#ajaxLoadAni' ).fadeIn( 'slow' );
        
        $.ajax({
            url: '<?php echo base_url() ?>index.php/act_item/getById/' + updateId,
            dataType: 'json',
            
            success: function( response ) {
				$( '#item_id' ).val( response.item_id );
                $( '#item_name' ).val( response.item_name );
				$( '#item_code' ).val( response.item_code );
                $( '#item_group_id' ).val( response.item_group_id );
                $( '#item_category_id' ).val( response.item_category_id );
                $( '#item_group_name' ).val( response.item_group_name );
                $( '#default_price' ).val(response.default_price);               
                
                $( '#ajaxLoadAni' ).fadeOut( 'slow' );
                
                //--- assign id to hidden field ---
                $( '#userId' ).val( updateId );
                
                

                 
                
                $( '#updateDialog' ).dialog( 'open' );
            }
        });
        
        return false;
    }); //end update delegate
    
    $( '#records' ).delegate( 'a.deleteBtn', 'click', function() {
        delHref = $( this ).attr( 'href' );
        
        $( '#delConfDialog' ).dialog( 'open' );
        
        return false;
    
    }); //end delete delegate
    
    
    // --- Create Record with Validation ---
    $( '#create form' ).validate({
        rules: {
            cName: { required: true },
            cEmail: { required: true, email: true }
        },
        
    });
    
}); //end document ready


function readUsers() {
    //display ajax loader animation
    $( '#ajaxLoadAni' ).fadeIn( 'slow' );
    
    var tempId = "";
    $.ajax({
        url: readUrl,
        dataType: 'json',
        success: function( response ) {
            var j=1;
            for( var i in response ) {

                var tempId;
                $.ajax({
                              url: "<?=base_url();?>index.php/act_item/defoger",
                              type: "POST",
                              data: {'str' : response[ i ].item_code},
                              dataType: 'json',
                              async: false,
                              success: function(response2) {
                                tempId = response2;
                              }
                       });

                response[ i ].updateLink = updateUrl + '/' + response[ i ].item_code;
                response[ i ].deleteLink = delUrl + '/' + response[ i ].item_code;
                response[ i ].item_code = tempId;
                response[ i ].nomor = j;
                j++;
            }
            
            //clear old rows
            $( '#records > tbody' ).html( '' );
            
            //append new rows
            $( '#readTemplate' ).render( response ).appendTo( "#records > tbody" );
            
            //apply dataTable to #records table and save its object in dataTable variable
            if( typeof dataTable == 'undefined' )
                dataTable = $( '#records' ).dataTable({"bJQueryUI": true});
            
            //hide ajax loader animation here...
            $( '#ajaxLoadAni' ).fadeOut( 'slow' );
        }
    });
} // end readUsers
</script>